<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cherry.js</title>
    <script src="../../Cherry.js"></script>

</head>
<body>
    <div id="app"></div>
</body>
<script>
    let optionItem = [
        {
            type:"single",
            value:{label:"张二狗名字",value:"张二狗"}
        },
        {
            type:"group",
            label:"名字组",
            value:[
                {label:"张二狗",value:"张二狗"},
                {label:"王铁蛋",value:"王铁蛋",disabled:true},
                {label:"王翠花",value:"王翠花"},
                {label:"刘寡妇",value:"刘寡妇"},
            ]
        }
    ];
    new CherryMain({
        app:"app",
        child:[
            new CHE_Select({
                name:"CHE_Select",
                margin:5,
                type:"Default",
                size:"Mini",
                init:{label:"默认名字 - 张二狗",value:"默认名字 - 张二狗"},
                value:optionItem,
                methods:{
                    change:(e,self)=>{
                        console.log(self.getValue());
                    }
                }
            }),
            new CHE_Select({
                margin:5,
                type:"Primary",
                size:"Mini",
                init:{label:"默认名字",value:"默认名字 - 张二狗"},
                value:optionItem,
                methods:{
                    change:(e,self)=>{
                        console.log(self.getValue());
                    }
                }
            }),
            new CHE_Select({
                margin:5,
                multiple:true,
                type:"Success",
                size:"Mini",
                init:{label:"默认名字",value:"默认名字 - 张二狗"},
                value:optionItem,
                methods:{
                    change:(e,self)=>{
                        console.log(self.getValue());
                    }
                }
            }),
            new CHE_Select({
                margin:5,
                type:"Info",
                size:"Mini",
                init:{label:"默认名字",value:"默认名字 - 张二狗"},
                value:optionItem,
                methods:{
                    change:(e,self)=>{
                        console.log(self.getValue());
                    }
                }
            }),
            new CHE_Select({
                margin:5,
                type:"Warning",
                size:"Default",
                init:{label:"默认名字 - 张二狗",value:"默认名字 - 张二狗"},
                value:optionItem,
                methods:{
                    change:(e,self)=>{
                        console.log(self.getValue());
                    }
                }
            }),
            new CHE_Select({
                margin:5,
                type:"Danger",
                size:"Big",
                init:{label:"默认名字 - 张二狗",value:"默认名字 - 张二狗"},
                value:optionItem,
                methods:{
                    change:(e,self)=>{
                        console.log(self.getValue());
                    }
                }
            }),
            new CHE_Container({
                height:20,
            }),
            new CHE_Button({
                margin:5,
                text:"设置Value",
                methods:{
                    click:()=>{
                        $GET("#CHE_Select").setValue([
                            {
                                type:"single",
                                value:{label:"名字修改后",value:"张二狗修改后"}
                            },
                            {
                                type:"group",
                                label:"名字组修改后",
                                value:[
                                    {label:"张二狗修改后",value:"张二狗修改后"},
                                    {label:"王铁蛋修改后",value:"王铁蛋修改后",disabled:true},
                                    {label:"王翠花修改后",value:"王翠花修改后"},
                                    {label:"刘寡妇修改后",value:"刘寡妇修改后"},
                                ]
                            }
                        ]);
                    }
                }
            }),
            new CHE_Button({
                margin:5,
                text:"获取Value",
                methods:{
                    click:()=>{
                        alert($GET("#CHE_Select").getValue());
                    }
                }
            })
        ],
        Created:()=>{

        }
    });



</script>
</html>